<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<style>
    .edui-default .edui-editor {
        border-radius: 0;
    }
</style>
<div id="articleForm" class="content" style="min-width:1100px;width:1100px;margin:0 auto;">
    <input class="mini-hidden" name="id"/>
    <table cellpadding="2" cellspacing="1" class="tb">
        <tr>
            <td style="padding:10px 0;"><span class="require-field">*</span> 所属分类：</td>
            <td>
                <input name="catId" class="mini-treeselect w200" emptyText="选择所属栏目" expandOnLoad="0"
                       url="${ctx}/category/list?module=mall" textField="catName" valueField="catId"
                       parentField="parentId" onbeforenodeselect="beforeNodeSelect" required="true"/>
                <span class="fr"><a class="mbtn btn-small btn-red" href="javascript:submitGoods();"><i class="fa fa-check"></i>确定</a></span>
            </td>
        </tr>
        <tr>
            <td style="text-align: right;"> 商品编码：</td>
            <td><input name="goodsSn" class="mini mini-textbox w200" /></td>
        </tr>
        <tr>
            <td style="padding:10px 0;"><span class="require-field">*</span> 商品名称：</td>
            <td><input name="goodsName" class="mini mini-textbox w350" required="true"/> 类型：
                <input name="goodsType" class="mini-combobox w100" url="${ctx}/dict/code?id=SPLX&_refresh" valueField="val" value="0" textField="name"/></td>
        </tr>
        <tr>
            <td style="text-align: right;"> 样式：</td>
            <td><input name="style" class="mini mini-textbox w500" /></td>
        </tr>
        <tr>
            <td style="text-align: right;padding:10px 0;"><i class="kg13"></i> 封面图片：</td>
            <td><input id="thumb" name="goodsThumb" class="mini mini-textbox w350" enabled="false"/>
                <a id="goods_thumb_upload" class="btn-small btn-red" style="margin-left:10px;padding:4px 8px;border:1px solid #D01405;" href="#"><i class="fa fa-cloud-upload"></i>上传</a>
                <span style="color:blue;margin-left:10px;cursor: pointer;text-decoration:underline;" onclick="viewGoodsThumb()">预览</span>
                <span style="margin-left:20px;color:#909090;">图片尺寸建议800*800</span>
            </td>
        </tr>
        <tr style="height:100px;">
            <td style="text-align: right;"> 商品图：</td>
            <td>
                <div class="fl">
                    <img src="${IMG_PATH}/upload_images.jpg" style="border:1px solid #d4d4d4;"/>
                </div>
                <div class="fl" style="margin-left:20px;">
                    <img src="${IMG_PATH}/upload_images.jpg" style="border:1px solid #d4d4d4;"/>
                </div>
                <div class="fl" style="margin-left:20px;">
                    <img src="${IMG_PATH}/upload_images.jpg" style="border:1px solid #d4d4d4;"/>
                </div>
                <div class="fl" style="margin-left:20px;">
                    <img src="${IMG_PATH}/upload_images.jpg" style="border:1px solid #d4d4d4;"/>
                </div>
                <div class="fl" style="margin-left:20px;">
                    <img src="${IMG_PATH}/upload_images.jpg" style="border:1px solid #d4d4d4;"/>
                </div>
            </td>
        </tr>
        <tr>
            <td class="tl" style="padding:10px 0;"><span class="require-field">*</span> 商品详情：</td>
            <td><script id="editor" type="text/plain" style="width:950px;height:400px;"></script></td>
        </tr>
        <tr>
            <td style="text-align: right;">商品描述：</td>
            <td><textarea name="goodsBrief" class="mini-textarea"  style="height:50px;width:952px;font-size: 10px;"></textarea></td>
        </tr>
        <tr>
            <td style="text-align: right;padding:10px 0;"> 关键词：</td>
            <td><input name="keywords" class="mini mini-textbox w500" emptyText="请填写关键词，用来被搜索引擎抓取"/></td>
        </tr>
        <tr>
            <td style="text-align: right; padding:10px 0;">库存数：</td>
            <td>
                <input name="goodsNum" class="mini mini-textbox w80" vtype="int" value="0" required="true"/>
                <span style="margin:0 20px 0 70px;">库存报警数：<input name="warnNum" class="mini mini-textbox w80" /></span>
            </td>
        </tr>
        <tr>
            <td style="text-align: right; padding:10px 0;">点击数：</td>
            <td>
                <input name="hits" class="mini mini-textbox w80" vtype="int" value="0" required="true"/>
                <span style="margin:0 20px 0 82px;">商品单位：<input name="goodsWeight" class="mini mini-textbox w150" required="true"/></span>
                <span style="margin:0 20px 0 42px;">市场售价：<input name="marketPrice" class="mini mini-textbox w100" vtype="float" required="true"/></span>
                <span style="margin-left:20px;">本店售价：<input name="shopPrice" class="mini mini-textbox w100" vtype="float" required="true"/></span>
            </td>
        </tr>
        <tr>
            <td style="text-align: right; padding:10px 0;">促销价：</td>
            <td>
                <input name="promotePrice" class="mini mini-textbox w100" vtype="float"/>
                <span style="margin-left:20px;">促销价开始时间：<input id="promoteStartDate" name="promoteStartDate" class="mini-datepicker" format="yyyy-MM-dd H:mm" timeFormat="H:mm" showTime="true" showTodayButton="true"/></span>
                <span style="margin-left:20px;">促销价结束时间：<input id="promoteEndDate" name="promoteEndDate" class="mini-datepicker" format="yyyy-MM-dd H:mm" timeFormat="H:mm" showTime="true" showTodayButton="true"/></span>
            </td>
        </tr>
    </table>
</div>
<form id="goodsThumbForm" method="post" enctype="multipart/form-data" runat="server">
    <input name="goodsThumb" id="goods_thumb" type="file" style="visibility:hidden;">
</form>
<script type="text/javascript" src="${UE_PATH}/ueditor.config.js" charset="utf-8"></script>
<script type="text/javascript" src="${UE_PATH}/ueditor.all.min.js" charset="utf-8"></script>
<script type="text/javascript">
    var init = function(){
        mini.parse();
        $("a#goods_thumb_upload").click(function () {
            $("input#goods_thumb")[0].click();
        });

        $("input#goods_thumb").on("change", function () {
            $("#goodsThumbForm").ajaxSubmit({
                type: "POST",
                dataType: "json",
                url: "${ctx}/ue/upload?action=uploadimage",
                success: function (res) {
                    if (res.state == "SUCCESS") {
                        tips.success("["+res.title+"] 图片上传上传成功!");
                        mini.get("thumb").setValue(res.url);
                    } else
                        tips.error(res.state);
                },
                async: true
            });
        });
    }

    var ue = UE.getEditor("editor", {
        topOffset:50
    });

    var beforeNodeSelect = function(e) {
        //禁止选中父节点
        if (e.isLeaf == false) e.cancel = true;
    }


    var viewGoodsThumb = function(){
        var value = mini.get("thumb").getValue();
        if(value == "")
            alert("没有上传 Thumb 图片!");
        else{
            $("body").css("overflow", "hidden");
            mini.showMessageBox({
                title: "图片预览",
                width: 300,      //宽度
                height: 250,     //高度
                html: `<img src="${ctx}`+value+`" width="100%" height="200"/>`,
                callback: function(action){
                    $("body").css("overflow", "auto");
                }
            });
        }
    }

    var frm = new mini.Form("articleForm");
    var option = 0;
    var submitGoods = function(){
        frm.validate();
        if (frm.isValid() == false) return;
        var data = frm.getData();
        data["goodsDesc"] = ue.getContent();
        var promoteStartDate = mini.get("promoteStartDate").getFormValue();
        if($.trim(promoteStartDate) != "") data["promoteStartDate"] = promoteStartDate;
        var promoteEndDate = mini.get("promoteEndDate").getFormValue();
        if($.trim(promoteEndDate) != "") data["promoteEndDate"] = promoteEndDate;
        if(promoteEndDate !="" && promoteStartDate >=  promoteEndDate){
            alert("促销开始时间不能大于结束时间!");
            return;
        }
        if (option == "0") {
            $.post("${ctx}/goods/save", data, function(res){
                if (res.code == 0) {
                    confirm("添加成功, 是否继续添加?", function(){
                        frm.clear();
                    }, function(){
                        app.loadMain("${ctx}/admin/b2b2c/list.jsp", 0, "商品管理 - 商品列表");
                    }, "确定", "取消");
                } else
                    tips.error(res.message);
            });
        } else if (option == "1") {
            $.post("${ctx}/goods/update", data, function(res){
                if (res.code == 0) {
                    confirm(`<i class='fa fa-check' style="font-size:1.5em;color:green;"></i>商品修改成功, 返回列表!`, function(){
                        app.loadMain("${ctx}/admin/b2b2c/list.jsp", 0, "商品管理 - 商品列表");
                    }, function(){

                    }, "确定", "取消");
                } else
                    tips.error(res.message);
            });
        }

    }

    var setParams = function(params){
        $.get("${ctx}/goods/find",{id:params}, function(res){
            if (res.code == 0) {
                frm.setData(res.data);
                option = 1;
                ue.ready(function() {
                    ue.setContent(res.data.goodsDesc);
                });
            } else
                tips.error(res.message);
        });
    }
</script>
